
<!DOCTYPE html>
<html lang="zh-cn" >
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="author"
      content="awesome404"
    />
      
    <title>Posts ｜ 鹊木笔记</title>
    
    
    
    <meta
      name="description"
      content="一名前端程序员的博客!!!"
    />
      
    <meta
      name="keywords"
      content="Blog, 程序员, 前端"
    />
      
    <link rel="alternate" type="application/rss+xml" href="https://awesome404.gitee.io/posts/index.xml" title="鹊木笔记" />
      <link
    rel="shortcut icon" href="https://awesome404.gitee.io/images/favicon.ico" />

    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://awesome404.gitee.io/css/normalize.css"
    />
    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://cdn.jsdelivr.net/npm/animate.css@4.1.0/animate.min.css"
    />
    <link rel="stylesheet" type="text/css" media="screen" href="https://awesome404.gitee.io/css/zozo.css" />
    <link
      rel="stylesheet"
      type="text/css"
      media="screen"
      href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css"
    />
    <link rel="stylesheet" type="text/css" media="screen" href="https://awesome404.gitee.io/css/highlight.css" />

    
    
  </head>
</html>


<body>
    <div class="main animate__animated animate__fadeInDown">
        
<div class="nav_container animated fadeInDown">
  <div class="site_nav" id="site_nav">
    <ul>
      
      <li>
        <a href="/">首页</a>
      </li>
      
      <li>
        <a href="/posts/">归档</a>
      </li>
      
      <li>
        <a href="/tags/">标签</a>
      </li>
      
      <li>
        <a href="/about/">关于</a>
      </li>
      
    </ul>
  </div>
  <div class="menu_icon">
    <a id="menu_icon">
      <i class="ri-settings-line"></i>
    </a>
  </div>
</div>

        <div class="header animated fadeInDown">
  <div class="site_title_container">
    <div class="site_title">
      <h1>
        <a href="https://awesome404.gitee.io">
          <span>鹊木笔记</span>
        </a>
      </h1>
    </div>
    <div class="description">
      <p class="sub_title">
        前端菜鸡的自我修养
      </p>
      <div class="my_socials">
         
        <a href="https://github.com/404Awesome" title="github" target="_blank"
          ><i class="ri-github-fill"></i
        ></a>
         
        <a
          href="https://awesome404.gitee.io/index.xml"
          type="application/rss+xml"
          title="rss"
          target="_blank"
          ><i class="ri-rss-fill"></i
        ></a>
      </div>
    </div>
  </div>
</div>

        <div class="content">
            
            <div id="select">
                <i class="ri-history-line"></i>
                <select id="list_select">
                
                    <option value=2022>2022</option>
                
                    <option value=2021>2021</option>
                
                    <option value=2020>2020</option>
                
                </select>
            </div>
            
            <div class="list_with_title">
                
                <div id=2022 class="listing_title">2022</div></a>
                <div class="listing">
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vite%E6%89%93%E5%8C%85cdn/">Vite打包CDN</a>
                            <div class="post_time"><span class="date">06-21</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/uni-app%E5%BC%95%E5%85%A5%E5%AD%97%E4%BD%93%E5%9B%BE%E6%A0%87/">UniApp引入字体图标</a>
                            <div class="post_time"><span class="date">04-10</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/docker%E4%B8%8Emongodb/">Docker与Mongodb</a>
                            <div class="post_time"><span class="date">03-24</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/expresssession%E6%8C%81%E4%B9%85%E5%8C%96/">ExpressSession数据持久化</a>
                            <div class="post_time"><span class="date">03-15</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/%E4%B8%80%E9%94%AE%E5%AE%89%E8%A3%85homebrew/">一键安装HomeBrew</a>
                            <div class="post_time"><span class="date">03-15</span></div>
                        </div>
                    </div>
                    
                </div>
                
                <div id=2021 class="listing_title">2021</div></a>
                <div class="listing">
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vscodeplugins/">VscodePlugins</a>
                            <div class="post_time"><span class="date">05-20</span></div>
                        </div>
                    </div>
                    
                </div>
                
                <div id=2020 class="listing_title">2020</div></a>
                <div class="listing">
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/webpack%E5%88%9D%E4%BD%93%E9%AA%8C/">Webpack初体验</a>
                            <div class="post_time"><span class="date">06-20</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/webpack%E7%AE%80%E4%BB%8B/">WebPack简介</a>
                            <div class="post_time"><span class="date">06-17</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/mysql%E5%85%A5%E9%97%A8/">MySQL入门</a>
                            <div class="post_time"><span class="date">05-30</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/nodejs%E7%AE%80%E4%BB%8B/">NodeJs简介</a>
                            <div class="post_time"><span class="date">05-23</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E4%B8%AD%E7%9A%84slot/">Vue2中的slot</a>
                            <div class="post_time"><span class="date">04-15</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E7%BB%84%E4%BB%B6/">Vue2组件</a>
                            <div class="post_time"><span class="date">04-13</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E8%AE%A1%E7%AE%97%E5%B1%9E%E6%80%A7/">Vue2计算属性</a>
                            <div class="post_time"><span class="date">04-09</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E8%AF%AD%E6%B3%95%E5%8F%8A%E6%8C%87%E4%BB%A4/">Vue2语法及指令</a>
                            <div class="post_time"><span class="date">04-08</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E5%8F%8Amvvm/">Vue2生命周期及MVVM</a>
                            <div class="post_time"><span class="date">04-08</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/%E7%BD%91%E7%AB%99%E7%AF%87/">网站篇</a>
                            <div class="post_time"><span class="date">04-07</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E5%85%A5%E9%97%A8/">Vue2入门</a>
                            <div class="post_time"><span class="date">04-06</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/vue2%E7%AE%80%E4%BB%8B%E5%8F%8A%E5%AE%89%E8%A3%85/">Vue2简介及安装</a>
                            <div class="post_time"><span class="date">04-06</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/javascript%E5%9F%BA%E7%A1%80/">JavaScript基础</a>
                            <div class="post_time"><span class="date">03-26</span></div>
                        </div>
                    </div>
                    
                    <div class="listing_item">
                        <div class="listing_post">
                            <a href="/posts/javascript%E7%94%B1%E6%9D%A5/">JavaScript由来</a>
                            <div class="post_time"><span class="date">03-26</span></div>
                        </div>
                    </div>
                    
                </div>
                
            </div>
            <div class="pagination"></div>
        </div>
    </div>
    <a id="back_to_top" href="#" class="back_to_top"><i class="ri-arrow-up-s-line"></i></a>
    
<style>
  #hitokoto {
    overflow: hidden;
    margin: 0 auto;
    width: 80%;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    color: #424242;
  }

  .footer {
    padding: 30px 0px;
  }
</style>

<footer class="footer">
  <p id="hitokoto">:D 获取中...</p>
</footer>

<script>
  fetch("https://v1.hitokoto.cn")
    .then((response) => response.json())
    .then((data) => {
      const hitokoto = document.getElementById("hitokoto");
      hitokoto.href = "https://hitokoto.cn/?uuid=" + data.uuid;
      hitokoto.innerText = data.hitokoto;
    })
    .catch((err) => err);
</script>

    <script src="https://awesome404.gitee.io/js/jquery-3.5.1.min.js"></script>
<link href="https://awesome404.gitee.io/css/fancybox.min.css" rel="stylesheet">
<script src="https://awesome404.gitee.io/js/fancybox.min.js"></script>
<script src="https://awesome404.gitee.io/js/zozo.js"></script>




</body>

<script>

(function (){
    let selectEl = document.getElementById("list_select");
    selectEl.onchange = (event) => {
        let year = event.target.value;
        if (!isNaN(year)){
            location.href =  `${location.href.split("#")[0]}#${ year }`;
        }
    }
})();
</script>
</html>